**Animate On Scroll **
1.install aosnpm install aos --save
2.angular.json
加上 styles , scripts
"styles": [
"src/styles.css",
"node_modules/aos/dist/aos.css"
],
"scripts": ["node_modules/aos/dist/aos.js"]
3.app.component.ts
import * as AOS from 'aos';
ngOnInit(): void {
AOS.init();
}
**4.app.component.html
**
<div data-aos="fade-up" data-aos-delay="1000" >
the content
</div>
參數:
data-aos >> animation 種類 ( fade-zoom-in,fade-up.....etc )
data-aos-delay >> 延遲 (ms)
..
..
..詳請至參考
參考:
AOS
Animate On Scroll Library
npm -AOS